import { Component, Input, OnInit } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { FormlyFormOptions } from '@ngx-formly/core';
import { ApesModalRef } from '@shared/apes/modal';
import { ApiService } from '@core/services/http/api.service';

@Component({
  selector: 'data-kanban-dialog',
  template: `
    <div apes-row [apesGutter]="8">
      <div apes-col apesSpan="12" class="data-kanban-dialog-span">
        <span>派车单:</span>
        <input apes-input class="dialog-span-text" type="text" [(ngModel)]="carInformationId" placeHolder="请输入派车单">
      </div>
      <div apes-col apesSpan="12">
        <span>物流站点:</span>
        <div class="boxDiv">
          <ng-select [items]="itemsData" bindLabel="name" [(ngModel)]="site"></ng-select>
        </div>
      </div>
      <div apes-col apesSpan="24" class="data-kanban-dialog-span text-red">
        <span>认真校验派车单信息输入是否正确！</span>
      </div>
    </div>
  `,
  styles: [`
    .data-kanban-dialog-span {
      text-align: center;
    }

    .dialog-span-text {
      width: 200px;
    }
    .boxDiv {
      display: inline-block;
      width: 200px;
    }
  `],
})
export class DataKanbanDialogComponent implements OnInit {

  modelData: any = {};

  carInformationId: any = '';
  itemsData: any = [];
  site: any = '';  // 物流站点

  constructor(
    private apiService: ApiService,
    private modal: ApesModalRef,
  ) {
  }

  ngOnInit() {
    // tms.site.findAllOperate
    let api = 'tms.site.findAllOperateNoPage';

    const data = {};

    this.apiService.post(api, { 'body': JSON.stringify(data) }).subscribe((body) => {

      if (body) {
        this.itemsData = body;
        this.site = body[0];
      }
    });
  }

  destroyModal(): void {
    this.modal.destroy(this.modelData);
  }

}
